#include("/front/family/_layout.html")
#@layout()
#define layoutImportcss()
    <link rel="stylesheet" href="/front/css/framework7-icons.css">
    <link rel="stylesheet" href="/front/css/chip.css">
#end
#define layoutHead()
	<title>发布</title>
#end
#define layoutHome()

<div class="navbar">
	<div class="navbar-inner toolbstyle">
		<div class="left">
			<a href="javascript:history.back()" class="link back">
				<i class="icon icon-back"></i>
			</a>
		</div>
		<div class="title">#(attr_type_name)</div>
		<div class="right">
			<a id="btn_a_save" class="button buttonw button-fill  color-white" href="javascript:;">发布</a>
		</div>
	</div>
</div>

<div class="page-content baby-photos-page-content">
	<form id="my-form">
		<input type="hidden" name="picese_id" value="">
		<input type="hidden" name="picese_type_id" value="#(attr_type_id)">
		<div class="block block-babyphotos">
			<div class="block-header">
				<textarea name="picese_info" class="textarea-babyphotos" rows="4" placeholder="说点什么吧..."></textarea>
			</div>
			<div class="baby-photos">
				<div class="baby-photos-item">
					<div class="baby-photos-item-inner">
						<i class="f7-icons">add</i>
						<input type="file" id="fileselector" name="photoselector" multiple>
					</div>
				</div>
			</div>
			<div class="block-footer">最多添加20张</div>
			<input type="hidden" id="picese_imgs" name="picese_imgs" value="">
		</div>
#if(attr_type_id == 1)
		<div class="block block-strong chip-box">
			<div class="chip-title">选择标签</div>
			<div class="chip">
				<div class="chip-label">作品</div>
			</div>
			<div class="chip">
				<div class="chip-label">重要时刻</div>
			</div>
			<div class="chip">
				<div class="chip-label">相册</div>
			</div>
		</div>
		<input type="hidden" id="picese_tag" name="picese_tag" value="">
#end
		<div class="block block-strong share-link">
			<a href="#">
				<div class="color-yellow">分享给同班小朋友</div>
				<i class="f7-icons color-yellow" id="check_color_yellow">check</i>
			</a>
			
		</div>
		<input type="hidden" id="read_power" name="read_power" value="1">
	</form>
</div>
#end
#define layoutImportjs()
    <script type="text/javascript" src="/front/js/chip.js"></script>
	<script type="text/javascript" src="/front/js/form.js"></script>
#end
#define layoutScript()
<script type="text/javascript">
	var typeid = getUrlParam('typeid');
	$$('#check_color_yellow').hide();
	$$("#fileselector").on("change", function(e){
		var sval = $$('#picese_imgs').val();
		var arry1 = trim(sval, ';').split(';');
		if (arry1.length >= 20){
			return false;
		}
		var file = e.target.files[0],
        reader = new FileReader();
		reader.readAsDataURL(file);
		reader.onload = function (ev) {
			if (checkUploadFile(file, 'images')){
				photo = ev.target.result //获取图片内容：base64字符串
				var formdata = { filename: file.name, 
								 filesize: file.size, 
								 filetype: '.'+file.type.split("/")[1], 
								 base64_data: photo };
								 
				sendPost('/front/family/fileup/upload_base64', formdata, function(res){
					//console.log(res);
					if (res.code == 0){
						var html ='<div class="baby-photos-item"><div class="baby-photos-item-inner"><img src="'+getZoomFileUrl(res.fileurl)+'"></div></div>';
						$$(".baby-photos").prepend(html);
						
						sval += res.fileurl + ';';
						$$('#picese_imgs').val(sval);
					}else{
						alert(res.msg);
					}
				});
			}
		};
	})
	
	$$(".share-link a").on("click", function(){
	     $$(this).find("i").toggleClass("color-yellow");
		 var i = 0;
		 if (this.outerHTML.indexOf('color-yellow')>0){
			 i = 1;
		 }
		 $$('#read_power').val(i);
	})
	
	$$(".chip").on("click", function(){
	     $$(this).toggleClass("color-orange");
		 var tag_name = this.innerText;
		 var tag_vals = $$('#picese_tag').val();
		 
		 if(this.outerHTML.indexOf('color-orange')>0){
			 tag_vals += tag_name + ' ';
		 }else{
			 tag_vals = tag_vals.replace(tag_name+' ', '');
		 }
		 $$('#picese_tag').val(tag_vals);
	})
	
	$$('#btn_a_save').on('click', function(){
		if (validateForm('#my-form')){
		  var formData = app.form.convertToData('#my-form');
		   // 调用接口提交数据
		  var url = "/front/family/lifepieces/save";
		  app.request({
			  url: url,
			  method: "POST",
			  dataType: "json", // 返回数据类型，可以是 json
			  data: formData,
			  success: function(res, status){
					alert(res.msg);
				  if(res.code == 200){
					  window.location.href = '/front/family/classes';
				  }
			  },
			  error: function(xhr, status){
				  alert(status);
			  }
		  });
		}
		return false;
	});
</script>
#end